<template>
	<div class="register-index">
		<div class="img">
			<img src="../../assets/image/rbg2.png" alt="">
		</div>
		<div class="input-me">
			<div class="account">
				<div class="left">
					<i class="iconfont">&#xe86c;</i>
					<span>账号</span>
				</div>
				<div class="center">
					<input type="number" v-model="phone" placeholder="请输入11位手机号">
				</div>
				<div class="right" @click="getcode()">{{code}}</div>
			</div>
			<div class="verification">
				<div class="left">
					<i class="iconfont"><img src="../../assets/image/yz-code.png" alt=""></i>
					<span>验证码</span>
				</div>
				<div class="center">
					<input type="number" v-model="verification" placeholder="请输入6位验证码">
				</div>
			</div>
		</div>
		<div @click="goregister()" class="authentication">去注册</div>
		<div class="popup-container">
			<mt-popup
			  v-model="popupVisible"
			  position="top"
			  :modal="modal">
			  {{popupContent}}
			</mt-popup>
		</div>
	</div>
</template>

<script>
import axios from 'axios';
import { MessageBox, Popup } from 'mint-ui';
export default {
	components: {
		'mt-popup': Popup,	
	},
	data () {
		return {
			code: '获取验证码',
			time: 60,
			phone: '',
			popupVisible: false,
			popupContent: '',
			modal: false,
			verification: ''
		}
	},
	 mounted() {
        const vm = this;
        let url = window.location.href;
        vm.wxShare(url);
    },
	methods: {
		getcode(){
			const vm = this;
			let phoneReg = /^1[34578]\d{9}$/;
			if (!phoneReg.test(vm.phone)) {
				vm.popupVisible = true;
				vm.modal = true; 
				vm.popupContent = '请输入正确的手机号码';
				setTimeout(function() {
					vm.popupVisible = false;
				}, 1600);
			}else {
				vm.code = vm.time+'s';
				let timer = setInterval(function(){
					vm.time = vm.time-1;
					vm.code = vm.time+'s';
					if(vm.time==0){
						clearInterval(timer);
						vm.code = "获取验证码";
						vm.time=60
					}
				},1000)
				axios.post(`/Weixin/Sms/sms_send`,{phone: vm.phone}).then(res=>{
					let data = res.data;
					if(data.code==1){
						vm.$toast('短信发送成功');
					}else {
						clearInterval(timer);
                        MessageBox.alert(data.msg);
                        vm.code = "获取验证码";
						vm.time=60;
					}
				}).catch(()=>{MessageBox.alert('网络错误')})
			}      
		},	
		goregister(){
			const vm = this;
			axios.post(`/Weixin/Sms/verify`,{phone: vm.phone,code: vm.verification}).then(res=>{
					let data = res.data;
					if(data.code==1){
						axios.post('/Weixin/Member/bindPhone',{phone: vm.phone}).then(res=>{
							let json = res.data;
							if(json.code==1){
								vm.$router.replace({path: '/registersuccess',query: {register_status: 1}})
							}else {
								MessageBox.alert(json.msg);
							}
						})
					}else {
						MessageBox.alert(data.msg);
					}
				}).catch(()=>{MessageBox.alert('网络错误')})
		}
	},
	created() {
		
	}
}
</script>

<style>

</style>
